﻿<template>
  <div style="padding:0px;">
    <el-form :model="dialogForm" :rules="rules" ref="dialogForm" :label-width="formLabelWidth">
      <el-card class="box-card">

        <div class="text item">
          <el-form-item label="使用者姓名" prop="person">
            <el-input :maxlength="20" v-model="dialogForm.person" auto-complete="off" :disabled="!basicDialogFormVisible.isAdd"></el-input>
          </el-form-item>
          <el-form-item label="手机号码" prop="phone">
            <el-input :maxlength="11" v-model="dialogForm.phone" auto-complete="off" :disabled="!basicDialogFormVisible.isAdd"></el-input>
          </el-form-item>
          <el-form-item label="使用者身份证号码" prop='idCard'>
            <el-input :maxlength="18" v-model="dialogForm.idCard" auto-complete="off" :disabled="!basicDialogFormVisible.isAdd"></el-input>
          </el-form-item>
          <el-form-item label="登陆密码" prop="password" :rules="this.basicDialogFormVisible.id===''?rules.password:[{ required: false}]">
            <input type="text" style="position:absolute;right:10000px;">
            <el-input v-model="dialogForm.password" :maxlength="20" type="password" auto-complete="off"></el-input>
            <el-alert style='margin-top:5px;' v-if="basicDialogFormVisible.id!=''" title="如果不修改，请留空" type="info" :closable="false"></el-alert>
          </el-form-item>
          <el-form-item label="经销商名称" prop="name">
            <el-input :maxlength="30" v-model="dialogForm.name" auto-complete="off" :disabled="!basicDialogFormVisible.isAdd"></el-input>
          </el-form-item>
          <el-form-item label="经销商类别" prop="category">
            <el-select v-model="dialogForm.category" placeholder="经销商类别" :disabled="!basicDialogFormVisible.isAdd">
              <el-option label="经销商类别" value="">
              </el-option>
              <el-option v-for="(item, index) in type" :label="item" :value="index-0" :key="index">
              </el-option>
            </el-select>
          </el-form-item>

          <el-form-item label="统一社会信用代码" prop='documentId'>
            <el-input v-model="dialogForm.documentId" auto-complete="off" @blur="toUpperCase('documentId')" :disabled="!basicDialogFormVisible.id==''"
              :maxlength="18"></el-input>
          </el-form-item>
          <el-form-item label="垫资利率(万几每天)" prop="interestRate">
            <el-input v-model.number="dialogForm.interestRate" @blur="FormatInterestRate('interestRate')" auto-complete="off"></el-input>
          </el-form-item>
          <el-form-item label="库融利率(万几每天)" prop="mortgageInterestRate">
            <el-input v-model.number="dialogForm.mortgageInterestRate" @blur="FormatInterestRate('mortgageInterestRate')" auto-complete="off"></el-input>
          </el-form-item>

          <el-form-item label="允许最大子账号数" prop="subaccountsNumber" >
              <!-- :disabled="!basicDialogFormVisible.id==''" -->
            <el-input v-model.number="dialogForm.subaccountsNumber" auto-complete="off"   :maxlength="2"></el-input>
          </el-form-item>
            <el-form-item label="已有子账号数" v-if='this.basicDialogFormVisible.id'>
            <el-input v-model.number="dialogForm.existSubaccounts" auto-complete="off" disabled></el-input>
          </el-form-item>

          

          

          <el-form-item v-if="basicDialogFormVisible.id==''" label="是否注册云合同">
            <el-radio-group v-model="dialogForm.isRegister">
              <el-radio :label="true">是</el-radio>
              <el-radio :label="false">否</el-radio>
            </el-radio-group>
          </el-form-item>

          <el-form-item label="使用者身份证照片" class="is-required">
            <qiniu :qiniuImage="dialogForm.idCardPics" :packJson="packJson2" :id="dialogForm.idCardPics.id" :canDelete="true"></qiniu>
          </el-form-item>
        </div>
      </el-card>
      <div style="text-align:right;margin-top:15px;">
        <el-button @click="returnBack">返 回</el-button>
        <el-button type="primary" @click="submitConfirmForm('dialogForm')">提 交</el-button>
      </div>
    </el-form>
  </div>
</template>
<script>
  import router from '@/router';
  import agentHttp from '@/utils/agentHttp.js'
  import {
    require,
    phone,
    decimalFour,
    numOrEnglish,
    max100,
    isCard,
    decimalTwo
  } from '@/utils/rules.js';
  import qiniu from '@/views/qiniu/upload';

  export default {
    created() {
      this.$set(this.dialogForm, 'isRegister', true);
      if (this.basicDialogFormVisible.id !== "") {
        //修改
        this.selectData();
      } else {
        this.getStatusMap();
      }
    },
    props: ['basicDialogFormVisible', 'tableData'],
    data() {
      return {
        formLabelWidth: '170px',
        type: {},
        //弹窗或者查看页面信息
        dialogForm: {
          name: "",     //经销商名称
          person: "",   //使用者姓名
          phone: "",    //手机
          idCard:'',
          documentId: "",   //统一社会信用代码
          interestRate: "",   //垫资利率
          mortgageInterestRate: "",   //库融利率
          password: "",         //密码
          category: "" ,       //经销商类别
          isRegister:'',        //是否注册云合同
          subaccountsNumber:"",
          // idCardPics:{
          //   	id: Math.random() * 100,
			    //     image_uri:[]
          // },
        },
        rules: {
          password: [require('登陆密码')],
          name: [require('经销商名称')],
          person: [require('使用者姓名')],
          //  subaccountsNumber: [require('允许最大账号', {trigger: "blur"}), {validator: decimalTwo,trigger: "blur"}],
           subaccountsNumber: [require('允许最大账号')],
            phone: [require('手机号码', {trigger: "blur"}), {validator: phone,trigger: "blur"}],
           idCard: [require("身份证号码", {
            trigger: "blur"
          }), {
            validator: isCard,
            trigger: "blur"
          }],
          category: [require('经销商类别', {
            type: "number",
            trigger: "change"
          })],
          documentId: [require('统一社会信用代码', {
            trigger: "blur"
          }), {
            validator: numOrEnglish,
            trigger: "blur"
          }],
          interestRate: [require('垫资利率', {
            trigger: "blur"
          }), {
            validator: decimalFour,
            trigger: "blur"
          }, {
            validator: max100,
            trigger: "blur"
          }],
          mortgageInterestRate: [require('库融利率', {
            trigger: "blur"
          }), {
            validator: decimalFour,
            trigger: "blur"
          }, {
            validator: max100,
            trigger: "blur"
          }]

        },
        packJson2: {
          maxLength: 2, //最大图片数量
          minLength: 5, //最大图片数量
          accept: "", //image/gif,image/jpeg,image/jpg,image/png如果是这些，可以不传此参数
          size: 4, //图片大小  单位兆
        },
      }
    },
    methods: {

      returnBack() {
        this.basicDialogFormVisible.dialogFormVisible = false;
      },
      submitConfirmForm(formName) {
        this.$refs[formName].validate((valid) => {
          if (valid) {
            if (this.basicDialogFormVisible.id === "") {
              //添加
              this.addData();
            } else {
              //修改
              this.editData();
            }
          } else {
            this.$nextTick(() => {
              setTimeout(() => {
                this.$message.warning(document.getElementsByClassName('el-form-item__error')[0].innerText);
              }, 500)
              return false;
            })
          }
        });
      },
      addData() {
        const params = {
              "category": this.dialogForm.category,
              "idCard": this.dialogForm.idCard,
              "idCardPic":this.dialogForm.idCardPics.image_uri.join(","),
              "password": this.dialogForm.password,
              "person": this.dialogForm.person,
              "phone": this.dialogForm.phone,
              "name":this.dialogForm.name,
              "documentId":this.dialogForm.documentId,
              "interestRate":this.dialogForm.interestRate,
              "mortgageInterestRate":this.dialogForm.mortgageInterestRate,
              "isRegister":this.dialogForm.isRegister,
              "documentId":this.dialogForm.documentId,
              "subaccountsNumber":this.dialogForm.subaccountsNumber
            }

        agentHttp.postJson('adminApi/admin/dealer/add_validated',params).then((data) => {
          if (data.success) {
            this.$emit('refreshTableData', null);
            this.basicDialogFormVisible.dialogFormVisible = false;
            this.$message.success(data.data || "添加成功");
          }
        })
      },
      editData() {
         this.dialogForm.idCardPic = this.dialogForm.idCardPics.image_uri.join(",") ;
        agentHttp.putJson('adminApi/admin/dealer/update_validated', this.dialogForm).then((data) => {
          if (data.success) {
            this.$emit('refreshTableData', null);
            this.basicDialogFormVisible.dialogFormVisible = false;
            this.$message.success(data.data || "修改成功");
          }
        })
      },
      selectData() {
        agentHttp.get('adminApi/admin/dealer/select_dealer/' + this.basicDialogFormVisible.id).then((data) => {
          if (data.success) {
            this.dialogForm = data.data.dealer;
            this.type = data.data.type;
            this.dialogForm.password = '';
            this.dialogForm.idCardPics = {
              id:Math.random() * 100,
              image_uri:this.dialogForm.idCardPic ? this.dialogForm.idCardPic.split(',').notempty() :[]
            }

            if (this.dialogForm.interestRate !== "" && this.dialogForm.interestRate !== null) {
              this.dialogForm.interestRate = (this.dialogForm.interestRate - 0).toFixed(4)
            }
            if (this.dialogForm.mortgageInterestRate !== "" && this.dialogForm.mortgageInterestRate !== null) {
              this.dialogForm.mortgageInterestRate = (this.dialogForm.mortgageInterestRate - 0).toFixed(4)
            }
          }
        })
      },
      getStatusMap() {
        agentHttp.get('adminApi/admin/dealer/get_status_map').then((data) => {
          this.dialogForm.subaccountsNumber = 10 ;
          this.type = data.data.type;
          this.dialogForm.idCardPics ={
              id:Math.random() * 100,
               image_uri:[]
          }
        })
      },
      FormatTwo(val) {
        this.dialogForm[val] = ((this.dialogForm[val] || "") - 0).toFixed(2);
      },
      FormatInterestRate(val) {
        this.dialogForm[val] = ((this.dialogForm[val] || "") - 0).toFixed(4);
      },
      toUpperCase(val) {
        this.dialogForm[val] = (this.dialogForm[val] || "").toUpperCase();
      },
    },
    components: {
      qiniu
    }
  };

</script>
